<html>
<head>
    <title>风险责任清单</title>
    <link rel="stylesheet" href="../../../assets/bundle.element.css">
    <link rel="stylesheet" href="../../../style.css">

    <style>
        body {
            background: #F0F2F6;
        }

        .main-head {
            background: #fff;
            padding-left: 10px;
            padding-top: 10px;
            margin-bottom: 0px;
            border: solid 1px #fff;
        }

        .chart-outer {
            height: 200px;
        }

        img {
            width: 30px;
            width: 32px;
        }

        td {
            text-align: center;
            height: 50px; /*这里需要自己调整，根据自己的需求调整高度*/
            position: relative;
        }

        td[class=first] {
            width: 100px;
        }

        td[class=first]:before {
            content: "";
            position: absolute;
            width: 1px;
            height: 160px;
            top: 0;
            left: 0;
            background-color: #000;
            display: block;
            transform: rotate(-73deg);
            transform-origin: top;
            -ms-transform: rotate(-73deg);
            -ms-transform-origin: top;
        }

        .title1 {
            position: absolute;
            top: 0px;
            right: 0px;
        }

        .title2 {
            position: absolute;
            top: 26px;
            right: 70px;
        }


    </style>
</head>
<body>
<div class="page" id="page-monitor">

    <div class="page-title">风险管理 › 风险研判标准</div>
    <div class="page-main">
        <el-tabs type="border-card" v-model="activeName">
            <el-tab-pane label="LEC研判法" name="LEC">
                <el-collapse style="margin: 15px">
                    <el-collapse-item title="发生事故的可能性(L)" name="1" @tab-click="handleClick(0)">
                        <el-table
                                :data="tableData[0].LECL"
                                style="width: 100%">
                            <el-table-column
                                    label="标准"
                                    prop="systitle">
                            </el-table-column>
                            <el-table-column
                                    label="本企的标准"
                                    prop="comtitle">
                            </el-table-column>
                            <el-table-column
                                    align="right">
                                <!--                                <template slot="header" slot-scope="scope">-->
                                <!--                                    <el-input-->
                                <!--                                            v-model="search"-->
                                <!--                                            size="mini"-->
                                <!--                                            placeholder="输入关键字搜索"/>-->
                                <!--                                </template>-->
                                <template slot-scope="scope">
                                    <el-button
                                            size="mini"
                                            @click="handleEdit(scope.$index, scope.row)">修改
                                    </el-button>
                                    <!--                                    <el-button-->
                                    <!--                                            size="mini"-->
                                    <!--                                            type="danger"-->
                                    <!--                                            @click="handleDelete(scope.$index, scope.row)">Delete-->
                                    <!--                                    </el-button>-->
                                </template>
                            </el-table-column>
                        </el-table>
                    </el-collapse-item>
                    <el-collapse-item title="暴露于危险环境的频繁程度(E)" name="2" @tab-click="handleClick(1)">
                        <el-table
                                :data="tableData[0].LECE"
                                style="width: 100%">
                            <el-table-column
                                    label="标准"
                                    prop="systitle">
                            </el-table-column>
                            <el-table-column
                                    label="本企的标准"
                                    prop="comtitle">
                            </el-table-column>
                            <el-table-column
                                    align="right">
                                <!--                                <template slot="header" slot-scope="scope">-->
                                <!--                                    <el-input-->
                                <!--                                            v-model="search"-->
                                <!--                                            size="mini"-->
                                <!--                                            placeholder="输入关键字搜索"/>-->
                                <!--                                </template>-->
                                <template slot-scope="scope">
                                    <el-button
                                            size="mini"
                                            @click="handleEdit(scope.$index, scope.row)">修改
                                    </el-button>
                                </template>
                            </el-table-column>
                        </el-table>
                    </el-collapse-item>
                    <el-collapse-item title="事故可能造成的后果(C)" name="4" @tab-click="handleClick(2)">
                        <el-table
                                :data="tableData[0].LECC"
                                style="width: 100%">
                            <el-table-column
                                    label="标准"
                                    prop="systitle">
                            </el-table-column>
                            <el-table-column
                                    label="本企的标准"
                                    prop="comtitle">
                            </el-table-column>
                            <el-table-column
                                    align="right">
                                <!--                                <template slot="header" slot-scope="scope">-->
                                <!--                                    <el-input-->
                                <!--                                            v-model="search"-->
                                <!--                                            size="mini"-->
                                <!--                                            placeholder="输入关键字搜索"/>-->
                                <!--                                </template>-->
                                <template slot-scope="scope">
                                    <el-button
                                            size="mini"
                                            @click="handleEdit(scope.$index, scope.row)">修改
                                    </el-button>
                                </template>
                            </el-table-column>
                        </el-table>
                    </el-collapse-item>
                </el-collapse>
            </el-tab-pane>
            <el-tab-pane label="LS研判法" name="LS">
                <el-collapse style="margin: 15px">
                    <el-collapse-item title="发生事故的可能性(L)" name="1" @tab-click="handleClick(0)">
                        <el-table
                                :data="tableData[1].LSL"
                                style="width: 100%">
                            <el-table-column
                                    label="标准"
                                    prop="systitle">
                            </el-table-column>
                            <el-table-column
                                    label="本企的标准"
                                    prop="comtitle">
                            </el-table-column>
                            <el-table-column
                                    align="right">
                                <template slot-scope="scope">
                                    <el-button
                                            size="mini"
                                            @click="handleEdit(scope.$index, scope.row)">修改
                                    </el-button>
                                </template>
                            </el-table-column>
                        </el-table>
                    </el-collapse-item>
                    <el-collapse-item title="事故后果严重性(S)" name="2" @tab-click="handleClick(1)">
                        <el-table
                                :data="tableData[1].LSS"
                                style="width: 100%">
                            <el-table-column
                                    label="标准"
                                    prop="systitle">
                            </el-table-column>
                            <el-table-column
                                    label="本企的标准"
                                    prop="comtitle">
                            </el-table-column>
                            <el-table-column
                                    align="right">
                                <template slot-scope="scope">
                                    <el-button
                                            size="mini"
                                            @click="handleEdit(scope.$index, scope.row)">修改
                                    </el-button>
                                </template>
                            </el-table-column>
                        </el-table>
                    </el-collapse-item>
                </el-collapse>
            </el-tab-pane>
            <!--            <el-tab-pane label="MES研判发" name="MES">-->
            <!--            </el-tab-pane>-->
        </el-tabs>

        <el-dialog title="标准修改" :visible.sync="dialogFormVisible" :show-close="false">
            <el-form :model="form">
                <el-col :span="12">
                    <el-form-item
                            label="本企的标准                                                                                                          "
                            :label-width="120">
                        <el-input v-model="form.comtitle" autocomplete="off"></el-input>
                    </el-form-item>
                </el-col>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="dialogFormVisible = false">取 消</el-button>
                <el-button type="primary" @click="submitClick">确 定</el-button>
            </div>
        </el-dialog>
    </div>
</div>
<script type='text/javascript' src='../../../assets/bundle.js' charset='utf-8'></script>
<script type='text/javascript' src='../../../assets/jquery-1.11.2.min.js' charset='utf-8'></script>
<script type='text/javascript' src='../../../assets/echarts.min.js' charset='utf-8'></script>

<script type='text/javascript' src='../../../js/common.js' charset='utf-8'></script>
<script type='text/javascript' src='../../../js/component.js' charset='utf-8'></script>

<script>

    var vuePage = new Vue({
        el: '#page-monitor',
        data: {
            activeName: 'LEC',
            tableData: [],
            dialogFormVisible: false,
            form: []
        },
        methods: {
            getData: function () {
                // SiteConfig.account.projectNo
                HttpUtil.get('Risktitle/List', {
                    projectNo: SiteConfig.account.projectNo,
                }).success((res) => {
                    vuePage.tableData = res.data;
                })
            },
            handleClick(tab) {
                console.log(12212121)
            },
            handleEdit(index, row) {
                console.log(index, row);
                this.dialogFormVisible = true;
                this.form = row;
            },
            handleDelete(index, row) {
                console.log(index, row);
            },
            submitClick(formName) {
                // SiteConfig.account.projectNo
                var param = {};
                param.projectNo = SiteConfig.account.projectNo,
                    param.comtitle = this.form.comtitle;
                param.type = this.form.type;
                param.itemType = this.form.itemType;
                param.item = this.form.item;
                HttpUtil.get('Risktitle/update', param).success((res) => {
                    if (res.state == 0) {
                        vuePage.getData();
                        this.$message.success('修改成功！');
                        this.dialogFormVisible = false;
                    }
                })
            },
        },
        created: function () {
            $('.page').show();
            this.getData();
            // this.getLSData();
            // this.getMESData();
        },
        mounted: function () {
        }
    });
</script>
</body>
</html>
